import { createRouter, createWebHashHistory } from 'vue-router'
// 如 先导入 后使用，先将所有的组件 都执行了一次
import Login from '@/views/login/Login.vue'
import Layout from '@/views/layout/Layout.vue'
import { useUserStore } from '../store/modules/user'
import { 
    HomeFilled,
    Suitcase,
    Shop,
    List,
    Menu,
    TrendCharts
 } from '@element-plus/icons-vue'

const routes = [
    {
        path: '/',
        redirect: '/login'
    },
    {
        path: '/login',
        component: Login
    },
    //   首页模块
    {
        path: '/home',
        component: Layout,
        redirect: '/home',
        icon: HomeFilled,
        children: [
            {
                path: '/home',
                meta: {title: '首页'},
                //路由懒加载
                // 只有访问这个路由时 ，才导入|运行对应的组件
                // 项目逇第一个页面需要 提升加载速度，懒加载必须处理 
                // 如果需要当页面需要提升访问速度，不能做懒加载
                component: () => import('@/views/home/Home.vue')
            },

        ]
    },
    //   账号模块
    {
        path: '/account',
        component: Layout,
        redirect: '/accountList',
        meta: {
            title: '账号管理',
        },
        icon:Suitcase,
        children: [
            {
                path: '/accountList',
                meta:{
                    title: '账号列表',
                },
                component: () => import('@/views/account/List.vue')
            },
            {
                path: '/accountAdd',
                meta:{
                    title: '添加账号',
                },
                component: () => import('@/views/account/Add.vue')
            },
            {
                path: '/accountCenter',
                meta: {
                    title: '个人中心',
                },
                component: () => import('@/views/account/Center.vue')
            },
            {
                path: '/accountEdit',
                meta: {
                    title: '修改密码',
                },
                component: () => import('@/views/account/Edit.vue')
            },

        ]
    },
    //   商品模块
    {
        path: '/goods',
        component: Layout,
        redirect: '/goodsList',
        meta:{
            title: '商品管理',
        },
        icon: Menu,
        children: [
            {
                path: '/goodsList',
                meta: {
                    title: '商品列表',
                },
                component: () => import('@/views/goods/List.vue')
            },
            {
                path: '/goodsAdd',
                meta: {
                    title: '添加商品',
                },
                component: () => import('@/views/goods/Add.vue')
            },
            {
                path: '/goodsType',
                meta: {
                    title: '商品分类',
                },
                component: () => import('@/views/goods/Type.vue')
            },


        ]
    },
    //   订单模块
    {
        path: '/orderList',
        component: Layout,
        redirect: '/orderList',
        icon: List,
        children: [
            {
                path: '/orderList',
                meta: {
                    title: '订单列表',
                },
                component: () => import('@/views/order/Order.vue')
            },
        ]
    },
    //   店铺模块
    {
        path: '/shopInfo',
        component: Layout,
        redirect: '/shopInfo',
        icon: Shop,
        children: [
            {
                path: '/shopInfo',
                meta: {
                    title: '店铺信息',
                },
                component: () => import('@/views/shop/Shop.vue')
            },
        ]
    },
    //   统计模块
    {
        path: '/statistics',
        component: Layout,
        meta: {
            title: '统计信息',
        },
        redirect: '/statisticsGoods',
        icon: TrendCharts,
        children: [
            {
                path: '/statisticsGoods',
                meta: {
                    title: '商品统计',
                },
                component: () => import('@/views/statistics/Goods.vue')
            },
            {
                path: '/statisticsOrder',
                meta: {
                    title: '订单统计',
                },
                component: () => import('@/views/statistics/Order.vue')
            }

        ]
    },
    {
        path: '/edit/:id',
        component: () => import('@/views/goods/Edit.vue')
    },
    {
        path:'/:pathMatch(.*)*',
        component: () => import('@/views/error/Error.vue')
    },

]

const router = createRouter({
    history: createWebHashHistory(),
    routes
})
router.beforeEach(async (to, from, next) => {
    const userStore = useUserStore()
    const token = userStore.token
    const publicPaths = ['/login']
  

    // 需要认证的页面
    if (!token && !publicPaths.includes(to.path)) {
        next('/login') // 跳转到登录页面
        return
    }
    next()
})
export { routes }; // 导出路由规则
export default router;